.conflicts-filters {
  :global(.filters) {
    margin-bottom: 20px;

    :global(.ember-power-select-multiple-trigger) {
      width: 100%;
      border-width: 2px;
      margin-bottom: 10px;
      &:focus {
        border-width: 2px;
      }
    }
  }
}

.search-icon {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  left: 7px;
  width: 20px;
  height: 20px;
  stroke: var(--input-border-color);
}

.input {
  @extend %textInput;
  width: 100%;
  padding: 7px 7px 7px 30px;
  font-family: var(--font-primary);
  font-size: 14px;
  color: var(--color-black);

  &:focus {
    box-shadow:
      inset 0 1px 2px rgba(#000, 0.1),
      0 1px 2px var(--shadow-color);
  }

  &::placeholder {
    color: var(--color-grey);
  }
}

button.advancedFilters {
  position: relative;
  box-shadow: none;
  flex-shrink: 0;
  &:focus,
  &:hover {
    transform: translate3d(0, 0, 0);
  }
}

.advancedFilters-badge {
  position: absolute;
  top: -4px;
  right: -7px;
  background: var(--color-primary);
  border-radius: var(--border-radius);
  padding: 0 4px 1px;
  color: #fff;
  font-size: 10px;
}

@media (max-width: 440px) {
  .filters-wrapper {
    flex-direction: column;
  }

  .queryForm,
  .filters-content {
    width: 100%;
    margin-right: 0;
  }
}
